Nginx 部署 vue 及 SpringBoot 前后端分离工程

nginx.conf

# 编辑配置文件
vi /etc/nginx/nginx.conf

# user 的默认值为 nobody
# 使用user指令可以指定启动运行工作进程的用户及用户组，这样对于系统的权限访问控制的更加精细，也更加安全。
# user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;
    # 默认 body 的大小最大是 1m 太小了
    client_max_body_size 1024m;

    sendfile        on;
    #tcp_nopush     on;
    keepalive_timeout  65;

    # gzip  on;

    server {
        listen       80;
        server_name  localhost;

        location / {
            root /usr/share/nginx/html;
            index index.html index.htm;
            try_files $uri $uri/ /index.html;
        }

        location /prod-api/ {
            proxy_set_header Host $http_host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_pass http://localhost:8080/;
        }
    }
}

需要压缩可参考：Nginx 开启 gzip 压缩

其他参考配置：https://gitee.com/dromara/RuoYi-Vue-Plus/blob/5.X/script/docker/nginx/conf/nginx.conf

部署 vitepress 需要注意的地方

# 普通 vue 应用一般配置 try_files 如下：
# try_files $uri $uri/ /index.html;

# 但是，部署 vitepress 时，try_files 不要默认为 index.html。
# try_files 解析不能像其他 Vue 应用那样默认为 index.html。这会导致页面状态处于无效。
# 应该配置如下：
try_files $uri $uri.html $uri/ =404;
# non existent pages
error_page 404 /404.html;
# a folder without index.html raises 403 in this setup
error_page 403 /404.html;

参考官网文档：https://vitepress.dev/zh/guide/deploy#nginx